<style>
    /* 根据字数修改 */
    .layui-form-label {
        width: 100px;
        text-align: left;
    }

    .layui-mini {
        display: inline-block;
        width: 100px;
        height: 24px;
        border-radius: 4px;
    }

    .layui-input-wrap {
        width: 100px;
        line-height: 24px;
        display: inline-block;
    }







    .list-item,
    .list {
        display: flex;
        align-items: baseline;
        padding: 0px 10px;
        flex-wrap: wrap;
        border-radius: 4px;
    }


    .tip {
        color: #00000073;
        margin-left: 12px;
        font-size: 12px;
        width: 100%;
    }
</style>
<div class="layuimini-container layuimini-page-anim">
    <!-- 用于创建子页面 -->
    <div class="page-create"></div>
    <!-- page-main-create -->
    <!-- 用于显示 隐藏 -->
    <div class="layuimini-main page-main-create">
        <div class="title-row layuimini-title title-sticky">
            <div class="title-left">
                <h4><span>计时积分工单加减分规则</span></h4>
            </div>
            <div class="title-right">
                <span class="title-right-text">
                    <button class="layui-btn layui-btn-primary layui-btn-sm" lay-on="edit">编辑</button>
                </span>
            </div>
        </div>
        <div class="section">
            <div class="top-panel p-5 mb-5">
                <div class="layui-bg-orange-500 p-5 base-card">
                    <div class="title-row">
                        <div class="title-left">
                            <div class="title-info">
                                <div class="title-line"></div>
                                <span class="title-text">计时工单加减分规则</span>
                            </div>
                        </div>
                    </div>

                    <div class="layui-row layui-col-space10 layui-font-gray">
                        <div class="layui-col-md4">
                            <div class="list-item">
                                <span class="sub-title">迟到/早退减分：</span>
                                <span class="sub-value font-weight layui-font-red">分（每单每次）</span>
                                <div class="layui-font-12 tip">&emsp;</div>
                            </div>

                        </div>
                        <div class="layui-col-md4 ">
                            <div class="list-item">
                                <span class="sub-title">半天旷工：</span>
                                <span class="font-weight layui-font-black">每单按50%工单积分</span>
                                <div class="layui-font-12 tip">（旷工时间段内积分为0，不再加减分）</div>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="list-item">
                                <span class="sub-title">全天旷工：</span>
                                <span class=" font-weight layui-font-black">每单按0%工单积分</span>
                                <div class="layui-font-12 tip">（旷工时间段内积分为0，不再加减分）</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


            <!-- 质量工单、额外计件工单、计时子工单与异常事件减分规则 -->
            <div class="top-panel p-5 mb-5">
                <div class="layui-bg-red-500 p-5 base-card">
                    <div class="title-row">
                        <div class="title-left">
                            <div class="title-info">
                                <div class="title-line"></div>
                                <span class="title-text">质量工单、额外计件工单、计时子工单与异常事件减分规则</span>
                            </div>
                        </div>
                    </div>

                    <div class="layui-row layui-col-space10 layui-font-gray">
                        <div class="layui-col-md4">
                            <div class="list-item">
                                <span class="sub-title">每日减分上限：</span>
                                <span class="sub-value font-weight layui-font-red">分</span>
                            </div>
                        </div>
                        <div class="layui-col-md4 ">
                            <div class="list-item">
                                <span class="sub-title">工单验收不通过減分范围：</span>
                                <span class="sub-value font-weight layui-font-red">分 至 1分</span>
                            </div>
                        </div>
                        <div class="layui-col-md4 ">
                            <div class="list-item">
                                <span class="sub-title">工单抽查不通过减分范围：</span>
                                <span class="sub-value font-weight layui-font-red">分 至 1分</span>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="list-item">
                                <span class="sub-title">坐岗减分：</span>
                                <span class="sub-value font-weight layui-font-red">分（每次）</span>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="list-item">
                                <span class="sub-title">离岗减分：</span>
                                <span class="sub-value font-weight layui-font-red">分（每次）</span>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="list-item">
                                <span class="sub-title">一人多机减分：</span>
                                <span class="sub-value font-weight layui-font-red">分（每次）</span>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="list-item ">
                                <span class="sub-title">网格内出勤时长未达标减分：</span>
                                <span class="sub-value font-weight layui-font-red">分（每次）</span>
                                <div class="layui-font-12 tip">（多作业网格时才生效）</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>



            <!-- 工单作业业务外有效报事加分规则 -->

            <div class="top-panel p-5 mb-5">
                <div class="layui-bg-green-500 p-5 base-card">
                    <div class="title-row">
                        <div class="title-left">
                            <div class="title-info">
                                <div class="title-line"></div>
                                <span class="title-text">工单作业业务外有效报事加分规则</span>
                            </div>
                            <div class="layui-font-12 layui-font-gray">
                                （有效报事——报事成功转工单，并且工单请求类非积分工单请求类）
                            </div>

                        </div>
                    </div>


                    <div class="layui-row layui-col-space10 layui-font-gray">
                        <div class="layui-col-md4">
                            <div class="list-item">
                                <span class="sub-title">每日加分上限：</span>
                                <span class="sub-value font-weight layui-font-green">分</span>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="list-item">
                                <span class="sub-title">每单加分：</span>
                                <span class="sub-value font-weight layui-font-green">分</span>
                            </div>
                        </div>

                    </div>
                </div>
            </div>




            <!-- 人员等级 -->

            <div class="top-panel p-5 mb-5">
                <div class="layui-bg-blue-500 p-5 base-card">
                    <div class="title-row">
                        <div class="title-left">
                            <div class="title-info">
                                <div class="title-line"></div>
                                <span class="title-text">人员等级</span>
                            </div>
                        </div>
                    </div>


                    <div class="layui-row layui-col-space10 layui-font-gray">
                        <div class="layui-col-md12">
                            等级显示： 显示
                        </div>
                        <div class="layui-col-md4">
                            <div class="list">
                                <span class="sub-title">新手：</span>
                                <span class="sub-value layui-font-black">
                                    有效接单工时低于
                                    <span class="font-weight">小时</span>
                                </span>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="list">
                                <span class="sub-title">熟手：</span>
                                <span class="sub-value layui-font-black">
                                    有效接单工时低于
                                    <span class="font-weight">小时</span>
                                </span>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="list">
                                <span class="sub-title">老手：</span>
                                <span class="sub-value layui-font-black">
                                    有效接单工时低于
                                    <span class="font-weight">小时</span>
                                </span>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>


    </div>
</div>
<script>
    layui.use(['form', 'table', 'tabs', 'miniPage', 'element'], function () {
        var $ = layui.jquery,
            layer = layui.layer,
            util = layui.util,
            miniPage = layui.miniPage;
        /******************** 事件 start ********************/
        /******************** 事件 end ********************/
        util.on('lay-on', {
            'edit': function () {
                miniPage.renderPageCreate('/page/accumulatedWorkOrder/accumulatedManager/components/pointsRuleAdd.html')
            },
        })
        /******************** 渲染组件 end ********************/
        // 开启监听 折叠展开事件
        miniPage.listen()

    });
</script>